<style type="text/css">
#detail_menu{ margin-top:5px;height:21px;border-bottom:1px solid #C4DEE6; display:inline-block;}
#detail_menu ul{padding:0px;margin:0px;}
#detail_menu ul li{padding:3px 10px;list-style:none;cursor:pointer; float:left;}
#detail_menu ul li:hover{background-color:#E7F2F5;}
</style>
<div id="detail_menu">
    <ul>
    <{foreach from=$data item=v key=k}>
        <li id="detail_menu_<{$k}>" onclick="showDetail(<{$k}>)"><{$site_name[$v.sid]}></li>
    <{/foreach}>
    </ul>
</div>

<div id="detail_content">
<{foreach from=$data item=v key=k}>
<div id="detail_content_<{$k}>" style="display:none;"><pre><{$v.detail|escape:"html"}></pre></div>
<{/foreach}>
</div>
<script type="text/javascript">
$("#detail_menu ul li:eq(0)").css('background-color','#E7F2F5');
$("#detail_content div:eq(0)").show();

function showDetail( k ){
	$("#detail_menu ul li").css('background-color','#FFF');
	$("#detail_menu_"+k).css('background-color','#E7F2F5');
	
	$("#detail_content div").hide();
	$("#detail_content_"+k).show();
}
</script>